<!DOCTYPE html>
<html lang="zh_cn">

<head>
    <meta charset="UTF-8">
    <link rel="icon" type="image/x-icon" href="#" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/yadmin.css">
    <link rel="stylesheet" href="/css/main.css">
    <link rel="icon" href="/images/favicon.ico" />
    <title>账号登录</title>
</head>


<body>
    <div id="bg">
        <div id="hint">
            <!-- 提示框 -->
            <p>登录失败</p>
        </div>
        <div id="login_wrap">
            <div id="login">
                <!-- 登录注册切换动画 -->
                <div id="status">
                    <p>云存储系统</p>
                </div>
                <span>
                    <form>
                        <p class="form"><input type="text" id="name" placeholder="用户名"></p>
                        <p class="form"><input type="password" id="password" placeholder="密码">
                        </p>
                        <p class="form confirm"><input type="password" id="confirm-passwd" placeholder="确认密码"></p>
                        <input type="button" value="登录" class="btn" id="log" style="margin-right: 20px;">
                        <input type="button" value="注册" class="btn" id="btn">
                    </form>
                    <a href="#">忘记密码?</a>
                </span>
            </div>

            <div id="login_img">
                <!-- 图片绘制框 -->
                <span class="circle">
                    <span></span>
                    <span></span>
                </span>
                <span class="star">
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                </span>
                <span class="fly_star">
                    <span></span>
                    <span></span>
                </span>
                <p id="title">CLOUD</p>
            </div>
        </div>
    </div>
</body>
<script src="/layui/layui.js"></script>
<script src="/js/jquery.js"></script>
<script>
    layui.use(['layer', 'form'], function () {
        var state = true;
        var confirm = $(".confirm")[0];
        var layer = layui.layer;
        var form = layui.form;

        $('#log').on('click', function () {
            if (state) {
                var name = $('#name').val();
                var password = $('#password').val();
                $.ajax({
                    url: '/file/user/login',
                    data: {
                        name: name,
                        password: password
                    },
                    type: 'POST',
                    success: function (res) {
                        console.log(res);
                        if (200 === res.code) {
                                    window.location.href = "/index.html";
                        } else if (10000 === res.code) {
                            layer.msg("账户或密码错误，请重新登录");
                        }

                    }
                });
            } else {
                confirm.style.height = "0";
                state = !state
            }
        });

        //注册按钮
        $('#btn').on('click', function () {
            layer.open({
                title: '提示信息',
                content: "暂未开启注册，尽情期待",
            });
            // if (state) {
            //     confirm.style.height = "51px";
            //     state = !state
            // } else {
            //     layer.alert("暂未开启注册，尽情期待");
            // }
        })
    });
</script>

</html>